<template>
	<view class="share">
		<view class="banner">
			<image src="../../../static/images/share-bg.png" mode=""></image>
			<!-- <view class="banner-c">
				<text class="share-title">邀请1位新朋友加入</text>
				<text class="share-toast">必得100永久算力</text>
			</view> -->
		</view>
		<view class="share-code">
			<text>分享邀请码：{{userInfo.invitation_code}}</text>
			<text class="copy" @click="copy(userInfo.invitation_code)">复制</text>
		</view>
		<view class="share-btn">
			<button @click="goPage('/pages/activity/poster/poster')">
				<text class="share-txt">立即邀请</text>
				<text class="iconfont icon-dayu-withe"></text>
			</button>
			<text class="quick">快速邀请通道</text>
		</view>
		<view class="my-share">
			<view class="my-shar-title">
				<text>我的好友</text>
				<text class="share-num">({{shareNum}}人)</text>
			</view>
			<view class="my-friend">
				<view class="my-list" v-for="(item,index) of data" :key="index">
					<view class="my-list-left">
						<image :src="item.avatar ?  item.avatar : require('../../../static/images/avatar.png')" mode=""></image>
						<view class="my-list-c">
							<text class="name">{{item.username}}</text>
							<text>{{formatDate(item.create_time*1000)}}</text>
						</view>
					</view>
					<view class="my-list-right">
						<text>已到账</text>
					</view>
				</view>
				<block-loading :status="status" :len="data.length"></block-loading>
			</view>
		</view>
		<view class="share-bottom" :class="$isPC ? 'IsPC':''">
			<view class="shar-list" @click="goPage('/pages/activity/poster/poster')">
				<image src="../../../static/images/erweima.png" mode=""></image>
				<text>二维码</text>
			</view>
			<view class="shar-list" @click="copyLink()">
				<image src="../../../static/images/copy.png" mode=""></image>
				<text>复制链接</text>
			</view>
		</view>
	</view>
</template>

<script>
	import {mapState} from "vuex"
	import {getShareNum,getShareUsers} from "@/api/activity.js"
	import {formatDate} from "@/utils/util.js"
	export default{
		name:"share",
		data(){
			return{
				data:[],
				status:"loading",
				page:1,
				shareNum:0
			}
		},
		mounted() {
			getShareNum().then(res=>{
				this.shareNum = res.data
			})
			this.getData();
		},
		onNavigationBarButtonTap(e) {
			uni.navigateTo({
				url:"/pages/public/agreement/agreement?name=规则说明&keyword=share_rule"
			})
		},
		//上拉加载
		onReachBottom() {
			this.getData();
		},
		methods:{
			formatDate(time){
				return formatDate(time);
			},
			goPage(url){
				uni.navigateTo({
					url:url
				})
			},
			copyLink(){
				let data = this.$baseURL + '/#/pages/entrance/register/register?code=' + this.userInfo.invitation_code;
				this.copy(data);
			},
			copy(code){
				uni.setClipboardData({
					data:code
				})
			},
			async getData(){
				let res = await getShareUsers({page:this.page,size:20});
				if(this.page===1&&res.data.length === 0){
					this.status = "nodata"
					return
				}
				if(this.page===1&&res.data.length > 0 && res.data.length < 20){
					this.status = "nomore"
				}
				if(res.data.length === 0){
					this.status = "nomore"
					return;
				}
				this.page++;
				this.data = this.data.concat(res.data);
			},
		},
		computed:{
			...mapState(['userInfo','isLogin']),
		}
	}
</script>

<style scoped lang="less" src="./share.less">
</style>
